<template>
  <a-card :bordered="false" style="margin-left: -10px;margin-right: 0;">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <!-- 搜索区域 -->
      <a-form layout="inline">
        <a-row :gutter="10">
          <!-- <a-col :md="12" :sm="12">
            <a-form-item label="选择部门" style="margin-left: 8px">
              <span v-if="!queryParam.selectedDepts"><a-tag>全部</a-tag></span>
              <span v-else :key="item.id" v-for="item in queryParam.selectedDepts">
                <a-tag>{{ item.name }}</a-tag>
              </span>
            </a-form-item>
          </a-col> -->
          <a-col :md="6" :sm="12">
            <a-form-item label="账号" style="margin-left: 8px">
              <a-input placeholder="" v-model="queryParam.username" allowClear></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="12">
            <a-form-item label="名称" style="margin-left: 8px">
              <a-input placeholder="" v-model="queryParam.realname" allowClear></a-input>
            </a-form-item>
          </a-col>
           <a-col :xl="4" :lg="7" :md="8" :sm="24">
            <a-form-item label="岗位">
              <a-select v-model="queryParam.post" allowClear>
                <a-select-option v-for="(item, index) in allPosition" :key="index" :value="item.code">
                  {{ item.name }}
                </a-select-option>
              </a-select>
            </a-form-item>
          </a-col>
          <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
            <a-col :md="6" :sm="24">
              <a-button type="primary" @click="searchQuery" icon="search" style="margin-left: 18px">查询</a-button>
              <a-button type="default" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </a-col>
          </span>
        </a-row>
      </a-form>
    </div>
    <!-- 操作按钮区域 -->
    <div class="table-operator" :md="24" :sm="24" style="margin-top: -15px">
      <a-button @click="handleAdd" type="primary" icon="plus" style="margin-top: 16px">新建用户</a-button>
    </div>

    <!-- table区域-begin -->
    <div>
      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        @change="handleTableChange"
      >
        <span slot="action" slot-scope="text, record">
          <a @click="handleEdit(record)">编辑</a>
          <a-divider type="vertical" />
          <a @click="handleChangePassword(record.username, record.id)">重置密码</a>
          <span v-has="'sysUser:openErp'">
            <a-divider type="vertical" />
            <a @click="handleOpenErp(record)">开通ERP账号</a>
          </span>
        </span>
        <span slot="status" slot-scope="text, record">
          <a-switch v-model="record.statusBool" @change="handleStatus(record)" />
        </span>
      </a-table>
    </div>
    <!-- table区域-end -->

    <!-- 表单区域 -->
    <user-modal1 ref="modalForm" @ok="modalFormOk"></user-modal1>

    <password-modal ref="passwordmodal" @ok="passwordModalOk"></password-modal>
    <open-erp-modal ref="openerpmodal" @ok="openErpModalOk"></open-erp-modal>
  </a-card>
</template>

<script>
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction, postAction, putAction } from '@/api/manage'
import UserModal1 from './UserModal1'
import PasswordModal from './PasswordModal'
import OpenErpModal from './OpenErpModal'

export default {
  name: 'UserInfo1',
  mixins: [JeecgListMixin],
  components: {
    UserModal1,
    PasswordModal,
    OpenErpModal,
  },
  data() {
    OpenErpModal
    return {
      description: '用户信息',
      currentDeptId: '',
      currentDept: {},
      allPosition:[],
      // 表头
      columns: [
        {
          title: '用户账号',
          align: 'center',
          dataIndex: 'username',
          width: '12%',
        },
        {
          title: '用户名称',
          align: 'center',
          dataIndex: 'realname',
          width: '12%',
        },
        {
          title: '岗位',
          align: 'center',
          dataIndex: 'post_dictText',
          width: '10%',
        },
        {
          title: '手机号',
          align: 'center',
          dataIndex: 'phone',
          width: '12%',
        },
        {
          title: '部门',
          align: 'center',
          dataIndex: 'orgCode',
          ellipsis: true,
          width: '15%',
        },
        {
          title: '开通ERP账号',
          align: 'center',
          dataIndex: 'thirdId',
          width: '12%',
        },
        {
          title: '启用',
          align: 'center',
          dataIndex: 'status',
          width: '10%',
          scopedSlots: { customRender: 'status' },
        },
        {
          title: '操作',
          dataIndex: 'action',
          scopedSlots: { customRender: 'action' },
          align: 'center',
        },
      ],
      url: {
        list: '/sys/user/departUserList1',
        frozenBatch: '/sys/user/frozenBatch',
        position: 'sys/position/list',
      },
    }
  },
  created() {
    this.queryPosition();
  },
  computed: {},
  methods: {
    queryPosition(){
      getAction(this.url.position).then((res) =>{
        console.log(res);
        if (res.success) {
            this.allPosition=res.result.records;
        }
      })
    },
    passwordModalOk() {
      //TODO 密码修改完成 不需要刷新页面，可以把datasource中的数据更新一下
    },
    openErpModalOk(){
      this.loadData()
    },
    handleChangePassword(username, userId) {
      this.$refs.passwordmodal.show(username, userId)
    },
    handleOpenErp(record) {
      this.$refs.openerpmodal.show(record)
    },
    handleStatus(record, checked, e) {
      this.loading = true
      let toModify = {}
      toModify.ids = record.id
      toModify.status = record.statusBool ? 1 : 0
      putAction(this.url.frozenBatch, toModify)
        .then((res) => {
          if (res.success) {
            this.$message.success('操作成功')
          } else {
            this.$message.warn(res.message)
          }
        })
        .finally(() => (this.loading = false))
    },
    selectDeparts(selectDeparts) {
      let depIds = selectDeparts && selectDeparts.length > 0 ? selectDeparts[0] : ""
      this.$set(this.queryParam, 'depIds', depIds)
      console.log('depIds=', depIds)
      this.loading = true
      this.loadData(1)
      setTimeout(()=>{
        this.loading = false
      },1500)
      
    },
    searchReset() {
      this.queryParam = {}
      this.loadData(1)
    },
    loadData(arg) {
      if (!this.url.list) {
        this.$message.error('请设置url.list属性!')
        return
      }
      //加载数据 若传入参数1则加载第一页的内容
      if (arg === 1) {
        this.ipagination.current = 1
      }
      //if (this.currentDeptId === '') return;
      let params = this.getQueryParams() //查询条件
      params.depId = this.currentDeptId
      getAction(this.url.list, params).then((res) => {
        if (res.success && res.result) {
          let datalist = []
          res.result.records.forEach((item) => {
            item.statusBool = item.status === 1
            datalist.push(item)
          })
          this.dataSource = datalist
          this.ipagination.total = res.result.total
        }
      })
    },
    open(record) {
      //console.log(record);
      this.currentDeptId = record.id
      this.currentDept = record
      this.loadData(1)
    },
    clearList() {
      this.currentDeptId = ''
      this.dataSource = []
    },
    handleEdit: function (record) {
      this.$refs.modalForm.title = '编辑'
      this.$refs.modalForm.departDisabled = false
      this.$refs.modalForm.disableSubmit = false
      this.$refs.modalForm.edit(record)
    },
    handleAdd: function () {
      // if (this.currentDeptId == '') {
      //   this.$message.error('请选择一个部门!')
      // } else {
      // this.$refs.modalForm.departDisabled = true
      //初始化负责部门
      // this.$refs.modalForm.nextDepartOptions = [{ value: this.currentDept.key, label: this.currentDept.title }]
      this.$refs.modalForm.title = '新增'
      this.$refs.modalForm.edit({
        activitiSync: '0',
        userIdentity: 1,
        // selecteddeparts: this.currentDeptId
      })
      // }
    },
    selectOK(data) {
      let params = {}
      params.depId = this.currentDeptId
      params.userIdList = []
      for (var a = 0; a < data.length; a++) {
        params.userIdList.push(data[a])
      }
      console.log(params)
      postAction(this.url.edit, params).then((res) => {
        if (res.success) {
          this.$message.success(res.message)
          this.loadData()
        } else {
          this.$message.warning(res.message)
        }
      })
    },
  },
}
</script>
<style scoped>
/** Button按钮间距 */
.ant-btn {
  margin-left: 3px;
}

.ant-card {
  margin-left: -30px;
  margin-right: -30px;
}

.table-page-search-wrapper {
  margin-top: -16px;
  margin-bottom: 16px;
}
</style>